<template>
    <div id='GoodsParams'>
        <el-row v-for="(v,i) in $store.state.goods.goods_params" :key='i'>
            <el-col :span="24">{{v.attr_name}}</el-col>
            <el-col :span="24" style='margin-top:10px'>
                <el-checkbox-group v-model="checkList">
                    <el-checkbox 
                    :label="c" 
                    checked 
                    @change='handlyChange(c)'
                    v-for="(c,i) in $store.getters['goods/get_attr_vals']" 
                    :key="i"></el-checkbox>
                </el-checkbox-group>
            </el-col>
        </el-row>
    </div>
</template>
<script>
export default {
    data() {
        return {
            checkList:[],
        }
    },
    mounted() {
        //获取参数列表
        let data={sel:'many',id:6}
        this.$store.dispatch('categorie/Acs_getCategoriesAttributes',data)
        .then(res=>{
                this.$store.commit('goods/CHANGE_GOODS_PARAMS',res)
            }
        ).catch(err=>console.log(err))
        
    },
    methods:{
        handlyChange(row){
            //console.log(row)
            let attr_vals=this.$store.getters['goods/get_attr_vals']
            attr_vals.splice(attr_vals.indexOf(row),1)
        }
    }
}
</script>
<style lang="scss" scoped>
    #GoodsParams{
        .is-checked{
            padding: 9px 20px 9px 10px;
            border:1px solid #409EFF;
            margin-right: 10px;
            border-radius: 5px;
        }
    }
</style>